<!DOCTYPE html>
<!--suppress ALL-->
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<div id="b">
    <div class="ui grid" style="margin-top: 1px">
        <div class="twelve wide column">
            <h4 class="ui top attached block header">
                <span><i class="fa fa-book"></i>&nbsp;搜索 <span style="color:red;" th:text="${q}"></span> 的结果 (总共搜到 <span
                        style="color: red"
                        th:text="${resultTotal}"></span> 条记录)</span>
            </h4>
            <div class="ui bottom attached segment orange">
                <div th:each="blog:${blogList}">
                    <div th:class="${''+blog.blogType.color+' ui segment shadow'}" style="margin-top: 10px">
                        <a th:class="${'ui '+blog.blogType.color+' ribbon label'}" style="font-size: 14px"
                           th:text="${blog.blogType.name}" th:href="${'/index?blogTypeId='+blog.blogType.id}"></a>
                        <h3><a th:href="'/blog/'+${blog.getId()}" th:utext="${blog.title}" class="hoverChangeColorRed"></a>
                        </h3>
                        <p style="color: gray">发布日期: <span
                                th:text="${#dates.format(blog.releaseDate,'yyyy-MM-dd HH:mm:ss')}"></span> | 阅读次数: <span
                                th:text="${blog.click}"></span> | 作者: LeDao</p>
                        <p style="font-size: 15px" th:utext="${#strings.abbreviate(blog.content,600)}"></p>
                        <div style="clear: both">
                            <a th:href="'/blog/'+${blog.getId()}" style="color: white">
                                <button th:class="${'ui '+blog.blogType.color+' button small'}">查看详情</button>
                            </a>
                        </div>
                    </div>
                </div>
                <div style="text-align: center;margin-top: 10px">
                    <p th:utext="${pageCode}"></p>
                </div>
            </div>
        </div>
        <div class="four wide column">
            <h4 class="ui top attached block header">
                <i class="fa fa-th-large"></i>&nbsp;按类别分类
            </h4>
            <div class="orange ui bottom attached segment">
                <p th:each="blogType:${blogTypeList}"><a th:href="${'/index?blogTypeId='+blogType.id}"
                                                         style="font-size: 15px" class="hoverChangeColorRed"
                                                         th:data-tooltip="${'查看分类：'+blogType.name}"
                                                         data-position="left center" th:text="${blogType.name}"></a><a
                        th:class="${'ui '+blogType.color+' small label'}" th:text="${blogType.blogNum}"></a></p>
            </div>
            <h4 class="ui top attached block header">
                <i class="fa fa-calendar"></i>&nbsp;按时间分类
            </h4>
            <div class="orange ui bottom attached segment">
                <p th:each="blogCount:${blogCountList}"><a
                        th:href="${'/index?releaseDateStr='+blogCount.releaseDateStr}" href="" style="font-size: 15px"
                        th:data-tooltip="${'查看分类：'+blogCount.releaseDateStr}"
                        data-position="left center" class="hoverChangeColorRed"
                        th:text="${blogCount.releaseDateStr}"></a><a
                        th:class="${'ui '+blogCount.color+' small label'}" th:text="${blogCount.blogCount}"></a></p>
            </div>
        </div>
    </div>
</div>
</body>
</html>